<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('修改随手记')"/>
    <th:block th:include="include :: summernote-css"/>
    <th:block th:include="include :: summernote-emoji-css"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-note-edit" th:object="${boardNote}">
        <input name="id" th:field="*{id}" type="hidden">
        <div class="form-group">
            <label class="col-sm-2 control-label is-required">标题：</label>
            <div class="col-sm-10">
                <input name="noteTitle" th:field="*{noteTitle}" class="form-control" type="text" required>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label is-required">内容：</label>
            <div class="col-sm-10">
                <input type="hidden" class="form-control" th:field="*{noteContent}">
                <div class="summernote" id="noteContent"></div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">摘要：</label>
            <div class="col-sm-10">
                <input name="noteSummary" th:field="*{noteSummary}" class="form-control" type="text">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label is-required">类型：</label>
            <div class="col-sm-10">
                <label class="radio-box">
                    <input type="radio" name="noteType" id="-1" value="-1" required th:field="*{noteType}"
                    > 动态</input>
                </label>
                <div class="radio-box" th:each="dict : ${@dict.getType('note_type')}">
                    <input type="radio" th:id="${'noteType_' + dict.dictCode}" name="noteType"
                           th:value="${dict.dictValue}" th:field="*{noteType}" required>
                    <label th:for="${'noteType_' + dict.dictCode}" th:text="${dict.dictLabel}"></label>
                </div>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label is-required">发布形式：</label>
            <div class="col-sm-10">
                <label class="radio-box">
                    <input name="isPublic" type="radio" id=0 value=0 required th:field="*{isPublic}"> 公 开</input>
                </label>
                <label class="radio-box">
                    <input name="isPublic" type="radio" id=1 value="1" required th:field="*{isPublic}"> 私
                    密(仅自己可见)</input>
                </label>
            </div>
        </div>

    </form>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: summernote-js"/>
<th:block th:include="include :: summernote-emoji-js"/>
<script th:inline="javascript">
    var prefix = ctx + "emmanuel/noteBoard";
    $("#form-note-edit").validate({
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            $.operate.save(prefix + "/edit", $('#form-note-edit').serialize());
        }
    }

    $(function () {
        document.emojiSource = '/ajax/libs/summernote/tam-emoji/img';
        $('.summernote').each(function (i) {
            $('#' + this.id).summernote({
                lang: 'zh-CN',
                height: 192,
                dialogsInBody: true,
                toolbar: [
                    ['style', ['style']],
                    ['insert', ['emoji']],
                    ['font', ['bold', 'underline', 'clear']],
                    ['fontname', ['fontname']],
                    ['color', ['color']],
                    ['para', ['ul', 'ol', 'paragraph']],
                    ['table', ['table']],
                    ['insert', ['link', 'picture', 'video']],
                    ['view', ['fullscreen', 'help']],
                ],
                callbacks: {
                    onChange: function (contents, $edittable) {
                        $("input[name='" + this.id + "']").val(contents);
                    },
                    // 我不需要网络存储图片，如果大家需要可以打开一下代码

                    // onImageUpload: function (files) {
                    //     var obj = this;
                    //     var data = new FormData();
                    //     data.append("file", files[0]);
                    //     $.ajax({
                    //         type: "post",
                    //         url: ctx + "common/upload",
                    //         data: data,
                    //         cache: false,
                    //         contentType: false,
                    //         processData: false,
                    //         dataType: 'json',
                    //         success: function (result) {
                    //             if (result.code == web_status.SUCCESS) {
                    //                 $('#' + obj.id).summernote('insertImage', result.url);
                    //             } else {
                    //                 $.modal.alertError(result.msg);
                    //             }
                    //         },
                    //         error: function (error) {
                    //             $.modal.alertWarning("图片上传失败。");
                    //         }
                    //     });
                    // }
                }
            });
            var content = $("input[name='" + this.id + "']").val();
            $('#' + this.id).summernote('code', content);
        })
    });
</script>
</body>
</html>
